<template>
  <div style="background: #ffffff;">

    <p style="color: #20a0ff">{{params}}</p>
    left组件

    我要监听 自定义事件（getList）

    <h3 style="color: red;" v-show="show">我已经监听到来自{{fromName}}组件触发了getList事件</h3>

    <button @click="emitToEvent('getResult',list)">触发对外事件（getResult）</button>

    <ul>
      <li v-for="v in list" :key="v">{{v}}</li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "left",
  props:{
    params:{
      type: Object,
      default: ()=>{}
    }
  },
  data(){
    return {
      show: false,
      list: [],
      fromName: null
    }
  },
  methods:{
    emitEvent(from,eName,eParams){
      if(eName==='getList'){
        //监听事件要做的事
        this.show = true
        this.list = eParams;
        this.fromName = from.component;
      }
    },
    emitToEvent(eName,eParams){
      this.$emit('emitEvents',eName,eParams); //触发事件，并且传递参数 //触发事件，并且传递参数
    },
  },
  mounted() {
    console.log(this.params)
  }
}
</script>

<style scoped>

</style>